<template>
  <el-select v-model="selectedValue" :placeholder="placeholder" @change="handleChange" :size="size"
    style="width: 200px;" :disabled="type == 'text' ? true : false">
    <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option>
  </el-select>
</template>

<script>
export default {
  props: {
    value: [String, Number, Boolean],
    placeholder: String,
    options: {
      type: Array,
      default: () => [],
    },
    size: String,
    disabled: Boolean,
    type: String
  },
  data() {
    return {
      selectedValue: this.value,
    };
  },
  watch: {
    value(newValue) {
      this.selectedValue = newValue;
    },
  },
  methods: {
    handleChange(newValue) {
      this.$emit("input", newValue);
    },
  },
};
</script>